﻿@inherits TscComponentBase

@if (ConfigurationRecord.IsEdit)
{
    <div style="height:100%;width:100%;" class="d-flex">
        <div class="ma-auto pl-5" style="display: flex;flex-wrap: wrap;max-width: 504px;">
            @foreach (var panelType in GetPanelTypes())
            {
                <MHover Disabled=panelType.Disabled>
                    <div @attributes="context.Attrs" @onclick="() => (panelType.Disabled?Task.CompletedTask:SelectPanelAsync(panelType.PannelType))" style="width: 144px;min-width:144px;height: 60px;min-height:60px;border: 1px solid #E4E8F3;@(panelType.Disabled?"cursor:not-allowed;":"")" class="d-flex px-3 mr-4 mb-4 fill rounded-2 @((context.Hover&&!panelType.Disabled) ? " fill-hover" : "") @(panelType.Disabled ? "regular3--text hover-" : "emphasis2--text hover-pointer dashboard-editor-ui-btn")">
                        <div class="d-flex my-auto borderNone" style="width:100%;">
                            <SIcon Class="mr-2" Color="@(panelType.Disabled?"#A3AED0":"#323D6F")">@panelType.Icon</SIcon>
                            <span class="borderNone">@I18n.Dashboard(panelType.PannelType.ToString())</span>
                            <MSpacer Class="borderNone" />
                            <SIcon Class="borderNone" Color="@(panelType.Disabled?"#A3AED0":"#323D6F")" Size="16">@IconConstants.Add</SIcon>
                        </div>
                    </div>
                </MHover>
            }
        </div>
    </div>
}